import 'dart:async';

import 'package:flutter/material.dart';
import 'package:pin_input_text_field/pin_input_text_field.dart';
import 'package:ytbusiness/config/yt_theme.dart';
import 'package:ytbusiness/utils/screen_adaptation.dart';

class PhoneSmsVerification extends StatefulWidget {
  @override
  _PhoneSmsVerificationState createState() => _PhoneSmsVerificationState();
}

class _PhoneSmsVerificationState extends State<PhoneSmsVerification> {
  Timer _countdownTimer;
  int _countdownNum = 60;
  String codeStr = "";   // 倒计时 文字
  bool canSend = false;
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        print('隐藏键盘⌨️, 隐藏键盘⌨️,');
        FocusScope.of(context).requestFocus(FocusNode());
      },
      child: Scaffold(
        backgroundColor: Colors.white,
        appBar: AppBar(
          elevation:0,
          centerTitle: true,
          backgroundColor: Colors.white,
          title:Text(
            '手机短信验证',
            style: TextStyle(
              color: Colors.black,
              fontSize: setSp(22),
            ),
          ),
          leading: GestureDetector(
            behavior: HitTestBehavior.opaque,
            onTap: (){
              Navigator.pop(context);
            },
            child: Row(
              children: [
                Container(
                  height: setWidth(44),
                  width: setWidth(50),
                  child: Icon(
                    Icons.close,
                    color: Colors.black,
                  ),
                ),
              ],
            ),
          ),
        ),
        body: Container(
          padding: EdgeInsets.only(left: setWidth(30), top: setWidth(131), right: setWidth(30),),
          width: setWidth(375),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                '请输入短信验证码',
                style: TextStyle(
                  color: Color(0xff404241),
                  fontSize: setSp(28),
                ),
              ),
              SizedBox(
                height: setWidth(5),
              ),
              Text(
                '短信验证码已下发至:1524888476',
                style: TextStyle(
                  color: Color(0xff989898),
                  fontSize: setSp(14),
                ),
              ),
              SizedBox(
                height: setWidth(40),
              ),
              SizedBox(
                height: 44,
                child: PinInputTextField(
                  pinLength: 6,
                  decoration: UnderlineDecoration(
                    colorBuilder: PinListenColorBuilder(Color(0xffe1e1e1), Color(0xffe1e1e1)),
                    bgColorBuilder: PinListenColorBuilder(Colors.transparent, Colors.transparent),
                    hintText: '      ',
                  ),
                  textInputAction: TextInputAction.done,
                  enabled: true,
                  textCapitalization: TextCapitalization.characters,
                  keyboardType: TextInputType.datetime,
                  onSubmit: (pin) {
                    debugPrint('submit pin:$pin');  // return  按钮点击事件
                  },
                  onChanged: (pin) async {
                    debugPrint('onChanged execute. pin:$pin');  // 输入变化事件!
                    if (pin.length == 6) {

                    }
                  },
                  enableInteractiveSelection: false,
                ),
              ),
              SizedBox(
                height: setWidth(20),
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Offstage(
                    offstage:(_countdownNum == 60),
                    child: Text(
                      "${_countdownNum}S后重新获取",
                      style: TextStyle(
                        color: Color(0xff989898),
                        fontSize: setSp(14),
                      ),
                    ),
                  ),
                  InkWell(
                    onTap: () {
                      _countdown();
                    },
                    child: Container(
                      width: setWidth(100),
                      height: setWidth(36),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(setWidth(4)),
                        border: Border.all(
                          width: setWidth(1),
                          color: (_countdownNum != 60)
                              ? Color(0xff989898)
                              : YTTheme.theme,
                        ),
                      ),
                      alignment: Alignment.center,
                      child: Text(
                        '获取验证码',
                        style: TextStyle(
                          color: (_countdownNum != 60)
                              ? Color(0xff989898)
                              : YTTheme.theme,
                          fontSize: setSp(14),
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }


  @override
  void dispose() {
    _countdownTimer?.cancel();
    _countdownTimer = null;
    super.dispose();
  }
  //发送验证码 倒计时
  _countdown(){
//    if(_phone.text.toString().trim() == ""){
//      toast("请输入手机号码");
//      return;
//    }

    if (_countdownTimer != null) {
      return;
    }
    _getCheckCode();

  }


  _getCheckCode(){
    //     开启倒计时
    _countdownTimer = Timer.periodic(new Duration(seconds: 1), (timer) {
      setState(() {
        if (_countdownNum > 0) {
          _countdownNum -= 1;
          print(_countdownNum);
        } else {
          _countdownNum = 60;
          _countdownTimer.cancel();
          _countdownTimer = null;
        }
      });
    });

  }

}
